<template>
  <div class="treeList">
    <p>业务模块</p>
    <t-input v-model="filterText" placeholder="输入关键字进行过滤"></t-input>
    <t-tree ref="tree" :data="data" :props="defaultProps" :filter-node-method="filterNode" class="filter-tree" is-select @on-click="onNodeSelect"></t-tree>
  </div>
</template>
<script>
import parseList from '../../../../../utils/array.js'
import { mapActions } from 'vuex'
export default {
  data() {
    return {
      data: [],
      filterText: '',
      defaultProps: {
        children: 'children',
        label: 'NAME'
      }
    }
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val)
    }
  },
  created() {
    this.getTreeList()
  },
  methods: {
    ...mapActions({
      setcode: 'setcode'
    }),
    getTreeList() {
      this.http.$http.post(this.services.QUERY_TREE_LIST, {
        bo: 'user',
        bc: 'USER_MODULE'
      }).then(res => {
        this.data = parseList(res.data.RESULT.DATALIST, 'CODE', 'PARENT_CODE')
      })
    },
    filterNode(value, data) {
      if (!value) return true
      return data.NAME.indexOf(value) !== -1
    },
    onNodeSelect(data) {
      this.setcode(data.CODE)
    }
  }
}
</script>
<style lang="scss" scoped>
.treeList {
  border: 1px solid #eee;
  height: 618px;
  padding: 10px;
  .input {
    margin-bottom: 10px;
  }
}
</style>

